<template>
	<view class="memberRebate_box">
		<block v-for="(item,index) in list" :key="index">
			<view class="header_box w100 flex" v-for="(items,indexs) in item.goods" :key="items">
				<view class="left_goods_img_box">
					<image class="w100 h100" :src="items.image_src" mode=""></image>
				</view>
				<view class="right_goods_detail">
					<view class="goods_name_txt s26 familytow fblod">
						{{items.title}}
					</view>
					<view class="goods_yx_box family f400 s24">
						【已选】{{items.spec}}
					</view>
					<view class="goods_price_box flexjus">
						<view class="flex">
							<view class="goods_price_txt familytow fblod s44">
								<text class="s22">￥</text>{{items.price}}
							</view>
						</view>
						<view class="goods_number familytow fblod s28">
							X{{items.number}}
						</view>
					</view>
				</view>
			</view>
			<view class="information w100">
				<view class="place_list flex">
					<view class="place_txt s24 familythree f400">
						所属店铺：
					</view>
					<view class="place_dy_txt s24 f500 family">
						{{item.shop}}
					</view>
				</view>
				<view class="place_list flex">
					<view class="place_txt s24 familythree f400">
						购买者信息：
					</view>
					<view class="place_dy_txt s24 f500 family">
						{{item.name}}
					</view>
				</view>
				<view class="place_list flex">
					<view class="place_txt s24 familythree f400">
						支付时间：
					</view>
					<view class="place_dy_txt s24 f500 family">
						{{get_date(item.paymenttime) || ''}}
					</view>
				</view>
				<view class="place_list flex">
					<view class="place_txt s24 familythree f400">
						订单状态：
					</view>
					<view class="place_dy_txt s24 f500 family">
						{{item.state}}
					</view>
				</view>
				<view class="place_list flex">
					<view class="place_txt s24 familythree f400">
						返利状态：
					</view>
					<view class="place_dy_txt s24 f500 family">
						{{item.rebate_status}}
					</view>
				</view>
				<view class="place_list flex">
					<view class="place_txt s24 familythree f400">
						订单ID：
					</view>
					<view class="place_dy_txt s24 f500 family">
						{{item.id}}
					</view>
				</view>
			</view>
		</block>
	</view>
</template>

<script>
	export default {
		data() {
			return {
				list: []
			}
		},
		onLoad(options) {
			this.getList(options.id)
		},
		methods: {
			getList(id) {
				this.$request({
					url: 'withdraw/getDetailOrder',
					data: {
						id: id
					}
				}).then(res => {
					this.list = res.data.data
				})
			}
		}
	}
</script>

<style scoped lang="scss">
	.memberRebate_box {
		overflow: hidden;

		.information {
			background-color: #fff;
			margin-top: 16upx;
			padding: 20upx 0 30upx 32upx;
			box-sizing: border-box;

			.place_list {
				margin-top: 20upx;

				.place_txt {
					width: 140upx;
					color: #888888;
				}

				.place_dy_txt {
					color: #000000;
					margin-left: 20upx;
				}

				.phone_txt {
					color: #E4B77F;
				}
			}
		}

		.header_box {
			height: 216upx;
			background-color: #fff;
			padding: 26upx 32upx 28upx 32upx;
			box-sizing: border-box;

			.left_goods_img_box {
				width: 162upx;
				height: 162upx;
				border-radius: 8upx;
				background-color: #666;
			}

			.right_goods_detail {
				width: 480upx;
				margin-left: 34upx;

				.goods_name_txt {
					width: 402upx;
					color: #000;
					overflow: hidden;
					text-overflow: ellipsis;
					white-space: nowrap;
				}

				.goods_yx_box {
					width: 402upx;
					height: 64upx;
					margin-top: 12upx;
					color: #666;
				}

				.goods_price_box {
					.goods_price_txt {
						color: #000;
					}

					.goods_price_line {
						color: #999;
						margin-top: 16upx;
						margin-left: 10upx;
					}

					.goods_number {
						color: #000;
						margin-top: 12upx;
					}
				}
			}
		}
	}
</style>
<style>
	page {
		background-color: #F4F5F9;
	}
</style>
